<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="author" content="order by dede58.com"/>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>文章修改 -简博客管理系统</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
<link rel="apple-touch-icon-precomposed" href="images/icon/icon.jpg">
<link rel="shortcut icon" href="images/icon/icon.jpg">
<script src="js/jquery-2.1.4.min.js"></script>
<!-- Markdown -->
<link rel="stylesheet" href="css/editormd.min.css" />
<!--[if gte IE 9]>
  <script src="js/jquery-1.11.1.min.js" type="text/javascript"></script>
  <script src="js/html5shiv.min.js" type="text/javascript"></script>
  <script src="js/respond.min.js" type="text/javascript"></script>
  <script src="js/selectivizr-min.js" type="text/javascript"></script>
<![endif]-->
<!--[if lt IE 9]>
  <script>window.location.href='upgrade-browser.html';</script>
<![endif]-->
</head>

<body class="user-select">
<section class="container-fluid">
  <header>
    <nav class="navbar navbar-default navbar-fixed-top">
      <div class="container-fluid">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> <span class="sr-only">切换导航</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
          <a class="navbar-brand" href="/">简博客</a> </div>
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
          <ul class="nav navbar-nav navbar-right">
            <li><a href="">消息 <span class="badge">1</span></a></li>
            <li class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">admin <span class="caret"></span></a>
              <ul class="dropdown-menu dropdown-menu-left">
                <li><a title="查看或修改个人信息" data-toggle="modal" data-target="#seeUserInfo">个人信息</a></li>
                <li><a title="查看您的登录记录" data-toggle="modal" data-target="#seeUserLoginlog">登录记录</a></li>
              </ul>
            </li>
            <li><a href="/Index/outLogin" onClick="if(!confirm('是否确认退出？'))return false;">退出登录</a></li>
            <li><a data-toggle="modal" data-target="#WeChat">帮助</a></li>
          </ul>
          <form action="" method="post" class="navbar-form navbar-right" role="search">
            <div class="input-group">
              <input type="text" class="form-control" autocomplete="off" placeholder="键入关键字搜索" maxlength="15">
              <span class="input-group-btn">
              <button class="btn btn-default" type="submit">搜索</button>
              </span> </div>
          </form>
        </div>
      </div>
    </nav>
  </header>
  <div class="row">
    <aside class="col-sm-3 col-md-2 col-lg-2 sidebar">
      <ul class="nav nav-sidebar">
        <li><a href="main.html">报告</a></li>
      </ul>
      <ul class="nav nav-sidebar">
        <li class="active"><a href="article.html">文章</a></li>
        <li><a href="notice.html">公告</a></li>
        <li><a href="comment.html">评论</a></li>
        <li><a href="readermsg.html">留言</a></li>
      </ul>
      <ul class="nav nav-sidebar">
        <li><a href="category.html">栏目</a></li>
        <li><a class="dropdown-toggle" id="otherMenu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">其他</a>
          <ul class="dropdown-menu" aria-labelledby="otherMenu">
            <li><a href="user-group.html">友情链接</a></li>
            <li><a href="loginlog.html">访问记录</a></li>
          </ul>
        </li>
      </ul>
      <ul class="nav nav-sidebar">
        <li><a class="dropdown-toggle" id="settingMenu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">设置</a>
          <ul class="dropdown-menu" aria-labelledby="settingMenu">
            <li><a href="setting.html">基本设置</a></li>
          </ul>
        </li>
      </ul>
    </aside>
    <div class="col-sm-9 col-sm-offset-3 col-md-10 col-lg-10 col-md-offset-2 main" id="main">
      <div class="row">
          <div class="col-md-9">
            <h1 class="page-header">文章修改</h1>
            <!-- id隐藏 -->
            <input type="hidden" id="article-id" value="">

            <div class="form-group">
              <label for="article-title" class="sr-only">标题</label>
              <input type="text" id="article-title" class="form-control" required autofocus autocomplete="off">
            </div>
            <div class="form-group">
              <label for="article-content" class="sr-only">内容</label>
              <!-- Markdown编辑器 -->
              <div id="editormd">
                  <textarea style="display:none;" id="article-content"></textarea>
              </div>
            </div>
            <div class="add-article-box">
              <h2 class="add-article-box-title"><span>描述</span></h2>
              <div class="add-article-box-content">
              	<textarea class="form-control" id="article-description" autocomplete="off"></textarea>
              </div>
            </div>
          </div>
          <div class="col-md-3">
            <h1 class="page-header">操作</h1>
            <div class="add-article-box">
              <h2 class="add-article-box-title"><span>文章状态</span></h2>
              <div class="add-article-box-content">
                <input type="radio" class="form-control" value="1" name="status"  autocomplete="off">发布
                <input type="radio" class="form-control" value="0" name="status"  autocomplete="off">草稿
              </div>
            </div>
            <div class="add-article-box">
              <h2 class="add-article-box-title"><span>标签</span></h2>
              <div class="add-article-box-content">
	            <input type="text" class="form-control" id="article-tags" autocomplete="off">
              </div>
            </div>
           
            <form id="uploadForm" class="add-article-form" method='post' enctype='multipart/form-data'>
              <div class="add-article-box">
                <h2 class="add-article-box-title"><span>标题图片</span></h2>
                <div class="add-article-box-content">
                  <input type="file" class="form-control" id="titel_image"  name="title_Url" autocomplete="off">
                   <p id="title_Url_text" class="btn btn-lg btn-primary btn-block"></p>
                </div>
              </div>
            </form>
        	  

            <div class="add-article-box">
              <h2 class="add-article-box-title"><span>是否允许评论</span></h2>
              <div class="add-article-box-content">
                <input type="radio" class="form-control" value="1" name="allowcomment" autocomplete="off">允许
                <input type="radio" class="form-control" value="0" name="allowcomment" autocomplete="off">不允许
              </div>
            </div>
            <div class="add-article-box">
              <div class="add-article-box-footer">
                <button class="btn btn-lg btn-primary btn-block" type="button" id="confimupdate">更新</button>
              </div>
            </div>
          </div>
      </div>
    </div>
</section>
<script src="js/bootstrap.min.js"></script> 
<script src="js/admin-scripts.js"></script>
<script src="js/editormd.min.js"></script>
<script type="text/javascript">
  $(function(){
    /**
       * markdown实例化
       * @type {[type]}
       */
      var editor = editormd("editormd", {
	      htmlDecode : "style,script,iframe", 
	      height : 500,
	      path : "./lib/", // Autoload modules mode, codemirror, marked... dependents libs path
	      saveHTMLToTextarea : true,
	      emoji : true,
	  	  previewTheme : "dark",       //下面这一行将使用dark主题
	      watch : true,                // 开启实时预览
	      tex: true,                   // 开启科学公式TeX语言支持，默认关闭
	      flowChart: true,             // 开启流程图支持，默认关闭
	      sequenceDiagram: true       // 开启时序/序列图支持，默认关闭,
      });

      /**
       * 图片上传
       * @param  {FormData} ){                                             var formData [description]
       * @param  {[type]}   async:false      [description]
       * @param  {[type]}   data:formData    [description]
       * @param  {[type]}   contentType:     false         [description]
       * @param  {[type]}   processData:     false         [description]
       * @param  {[type]}   success:function (result)      {                                                     if(0 [description]
       * @return {[type]}                    [description]
       */
    $("#titel_image").on("change",function(){
      var formData = new FormData(document.getElementById("uploadForm"));
      $.ajax({
            type:"post",
            url:"http://localhost:8081/contents/uploadImage",
            xhrFields:{
                widthCredentials:true
              },
            async:false,
            data:formData,
            /**
              *必须false才会自动加上正确的Content-Type
              */
              contentType: false,
              /*
              *
              * 必须false才会避开jQuery对 formdata 的默认处理
              * XMLHttpRequest会对 formdata 进行正确的处理
              */
              processData: false,
              success:function (result) {
                  if(0 == result.code){
                    $("#title_Url_text").html("图片上传成功");
                  }else{
                    $("#title_Url_text").html("图片上传失败");
                  }
              }
        })
    });

   /**
   * 更新contents
   * 
   * 获取url中的id,然后根据id查询contents详情
   */
    function getQueryVariable(variable){
       var query = window.location.search.substring(1);
       var vars = query.split("?");
       for (var i=0;i<vars.length;i++) {
               var pair = vars[i].split("=");
               if(pair[0] == variable){return pair[1];}
       }
       return(false);
    }

    /**
     * 根据id获取博客内容contents信息
     */
    //声明contents
    var blogDo;
    $(document).ready(function(){
      
        //获取商品详情
        $.ajax({
            url:"http://localhost:8081/contents/getById",
            type:"GET",
            xhrFields:{widthCredentials:true},
            data:{
                "id":getQueryVariable("id")
            },
            success:function (result) {
                if (0 == result.code){
                    blogDo = result.data;
                    reloadDom();
                } else {
                    alert("注册失败");
                }
            }
        });
    });

    function reloadDom(){
        $("#article-id").attr("value",blogDo.bid);
        $("#article-title").attr("value",blogDo.title);
        editor.setMarkdown(blogDo.content);
        $("#article-description").text(blogDo.description);
        $("#article-tags").attr("value",blogDo.tags);
       // $("#article-image").attr("src","http://localhost:8080/image/"+blogDo.titleUrl);
         //状态
        if (blogDo.status==1) {
          $("input[type='radio'][name='status']").get(0).checked=true;
        }else{
          $("input[type='radio'][name='status']").get(1).checked=true;
        }
        //是否允许评论
        if (blogDo.allowComment==1) {
          $("input[type='radio'][name='allowcomment']").get(0).checked=true;
        }else{
          $("input[type='radio'][name='allowcomment']").get(1).checked=true;
        }
        
    }


     /**
     * 更新内容
     */
    $('#confimupdate').on("click",function(){
      $.ajax({
            type:"post",
            url:"http://localhost:8081/contents/updateBlog",
            xhrFields:{
                widthCredentials:true
              },
            async:false,
            data:{
              "bid":$("#article-id").val(),
              "title":$("#article-title").val(),
              "content":editor.getMarkdown(),
              "description":$("#article-description").val(),
              "status":$("input[name='status']:checked").val(),
              "tags":$("#article-tags").val(),
              "allowcomment":$("input[name='allowcomment']:checked").val()
            },
            success:function (result) {
                if (0==result.code){
                    alert("更新成功");
                    window.location.href="article.html";
                }else {
                    alert("发布失败");
                }
            },
            error:function (result) {
                alert("未知错误");
            }
        })
    })
  });
</script>
</body>
</html>